<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>仓库-采购申请</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/iconfont.css" />
    <link rel="stylesheet" type="text/css" href="css/comm.css" />
    <link rel="stylesheet" type="text/css" href="../script/mui/mui.picker.min.css" />
    <link rel="stylesheet" type="text/css" href="../script/mui/mui.reset.css" />
    <link rel="stylesheet" type="text/css" href="../script/vant/index.css" />
    <link rel="stylesheet" type="text/css" href="css/form.css" />
    <link rel="stylesheet" type="text/css" href="css/editStyle.css" />
    <link rel="stylesheet" type="text/css" href="css/home_task_con.css" />
    <link rel="stylesheet" type="text/css" href="css/ckpurchaseapply.css" />
    <style type="text/css">
      

    </style>
</head>

<body>
    <div id="app" v-cloak>
         <!-- 申请部门 -->
         <div class="mask_bg" v-on:click="doCloseDepartment()" v-if="IsDepartmentOpen"></div>
         <div class="choose_box" v-if="IsDepartmentOpen">
             <div class="choose_room_title">
                 <div class="choose_room_title">选择部门信息</div>
             </div>
             <div class="choose_room_content">
                 <div v-on:click="doSelectDepartment(item)"  class="choose_room_item"  v-for="item in DepartmentList" v-bind:class="{'selected':item.IsSelected==true}" >
                     <label>{{item.Names}}</label><i v-if="item.IsSelected==true" class="icon iconfont icon-xuanze"></i>
                 </div>
             </div>
             <div class="aui_bottom" style="position: absolute;border-bottom-left-radius:10px;border-bottom-right-radius: 10px;">
                <div v-on:click="doCloseDepartment()" class="aui_bottombtn left">取消</div>
                <div v-on:click="doChooseOk()" class="aui_bottombtn right">确认</div>
            </div>
         </div>
         <!-- 选择时间 -->
         <van-calendar v-model="showCalender" :show-confirm="false" @confirm="onConfirm" >
            <template #top-info="day">
              </template>
        </van-calendar>
        <!-- 物品用途 -->
        <div class=" boxarea edit">
            <div class="aui_formitem">
                <div class="aui_formtitle">申请人</div>
                <div class="aui_formcontent">
                    <van-field v-model="form.ApplyUserName"  readonly="readonly" rows="1"  input-align="right" autosize  type="textarea"  placeholder="请填写"/>
                </div>
            </div>
            <div class="aui_formitem">
                <div class="aui_formtitle">申请部门</div>
                <div class="aui_formcontent" v-on:click="do_choose_department()" >
                    <input class="choose" v-model="form.DepartmentNames" readonly="readonly" type="text" placeholder="请选择">
                    <i class="icon iconfont icon-xiangyoujiantou"></i>
                </div>
            </div>
            <div class="aui_formitem">
                <div class="aui_formtitle">需求时间</div>
                <div class="aui_formcontent" v-on:click="do_choose_time()">
                    <span class="choose new-span-input" id="choosedatetime" data-options='{"type":"date"}' v-bind:class="{'textColorPlaceholder':form.DemandTime==''}">{{form.DemandTime==''?'请选择需求日期':form.DemandTime}}</span>
                    <i class="icon iconfont icon-xiangyoujiantou ml5"></i>
                </div>
            </div>
            <div class="aui_formitem no_line p0">
                <div class="aui_formtitle">用途说明</div>
            </div>
            <div class="aui_formitem no_line">
                <van-field v-model="form.GoodsUseName" class="moretext" rows="3" maxlength="500"  autosize type="textarea" placeholder="请填写(选填信息)" show-word-limit/>
            </div>
        </div>
        <!-- 物品 -->
        <div class=" boxarea edit" v-for="(item,index) in form.GoodsList" :key="index">
            <div class="aui_formitem only_line no_line p0">
                <div class="work_title">
                    物品{{index+1}}
                    <div class="deleteicon"  v-on:click="do_delete(item,index)"><i
                            class="icon iconfont icon-shanchu aui-font-size-14"></i></div>
                </div>
            </div>
            <div v-on:click="addbox()" class="aui_formitem">
                <div class="aui_formtitle">名称<img class="col-star" src="../image/redstar.png"></div>
                <div class="aui_formcontent">
                    <input class="choose" v-model="item.Name" readonly="readonly" type="text" placeholder="请选择">
                    <i class="icon iconfont icon-xiangyoujiantou"></i>
                </div>
            </div>
            <div class="aui_formitem">
                <div class="aui_formtitle">数量<img class="col-star" src="../image/redstar.png"></div>
                <div class="aui_formcontent">
                    <input type="number" placeholder="请填写" v-model="item.Number" v-on:input="onChangeProduct(item)">
                </div>
            </div>
            <div class="aui_formitem">
                <div class="aui_formtitle">单价</div>
                <div class="aui_formcontent">
                    <input type="number" placeholder="请填写" v-model="item.UnitPrice" v-on:input="onChangeProduct(item)">
                </div>
            </div>
            <div class="aui_formitem no_line">
                <div class="aui_formtitle">金额(元)</div>
                <div class="aui_formcontent">
                    <input type="number" placeholder="填写信息后获取" v-model="item.Money" readonly="readonly">
                </div>
            </div>
        </div>
        <div class="addbox" v-on:click="addbox()"><i class="icon iconfont icon-tianjia"></i>增加物品</div>
        <!-- 审批 -->
        <div class=" boxarea edit">
            <div class="aui_formitem only_line no_line p0">
                <div class="work_title">审批流程</div>

                <div class="gj_box">
                    <ul class="processul">
                        <li class="processulli  li-border-color-grey">
                            <div class="task_process_con">
                                <div class="handle">
                                    <div class="task_process_basic_title">
                                        <div class="task_process_basic_title_name fl">
                                            <div class="fl aui_formtitle" style="min-width: 2rem;">审批人<img
                                                    class="col-star" src="../image/redstar.png"></div>
                                            <div class="handle_con_msg ">
                                                <span v-if="choose_id_list.length==0">请选择审批人</span>
                                                <span v-if="choose_id_list.length>0">1人通过即可</span>
                                            </div>
                                        </div>
                                        <div class="fr" style="width: 70%;">
                                            <div class="task_process_basic_title_time ccc fr"
                                                v-on:click="choose_persons(1)"><i class="icon iconfont icon-addApp"></i>
                                            </div>
                                            <div v-if="choose_id_list.length<=3" class="shenpi"
                                                v-for="(item,index) in choose_id_list">
                                                <div class="shenpi_person">
                                                    <div class="person">{{item.UserName.slice(-2)}}</div>
                                                    <div class="person_name ellipsis-1">{{item.UserName}}</div>
                                                    <img v-on:click="guanbi_pic(item.UserID,1)" src="../image/cx.png">
                                                    <!-- <i class="icon iconfont icon-guanbi" ></i> -->
                                                </div>
                                            </div>
                                            <div v-if="choose_id_list.length>3">
                                                <div class="shenpi">
                                                    <div class="shenpi_person">
                                                        <div class="person" v-bind:class="{'small_active':select_id_list.length>99}" v-on:click="open_more(1)">{{choose_id_list.length}}人</div>
                                                        <!-- <div class="person"><i class="icon iconfont icon-sandian"
                                                                v-on:click="open_more()"></i></div> -->
                                                        <div class="person_name ellipsis-1">全部</div>
                                                    </div>
                                                </div>
                                                <div class="shenpi" v-for="(item,index) in choose_id_list.slice(-2)">
                                                    <div class="shenpi_person">
                                                        <div class="person">{{item.UserName.slice(-2)}}</div>
                                                        <div class="person_name ellipsis-1">{{item.UserName}}</div>
                                                        <img v-on:click="guanbi_pic(item.UserID,1)"
                                                            src="../image/cx.png">
                                                        <!-- <i class="icon iconfont icon-guanbi" ></i> -->
                                                    </div>
                                                </div>
                                            </div>

                                        </div>
                                        <div class="cl"></div>
                                    </div>
                                </div>
                                <div class="hide_height"></div>
                            </div>
                        </li>

                        <li class="processulli  li-border-color-grey">
                            <div class="task_process_con">
                                <div class="handle">
                                    <div class="task_process_basic_title">
                                        <div class="task_process_basic_title_name fl">
                                            <div class="fl">抄送人</div>
                                            <div class="handle_con_msg ">
                                                <span v-if="select_id_list.length==0">请选择抄送人</span>
                                                <span v-if="select_id_list.length>0">已选{{select_id_list.length}}人</span>
                                            </div>
                                        </div>
                                        <div class="fr" style="width: 70%;">
                                            <div class="task_process_basic_title_time ccc fr" style="margin-left: 15px;"
                                                v-on:click="choose_persons(0)"><i class="icon iconfont icon-addApp"></i>
                                            </div>

                                            <div v-if="select_id_list.length<=3" class="shenpi"
                                                v-for="(item,index) in select_id_list">
                                                <div class="shenpi_person">
                                                    <div class="person">{{item.UserName.slice(-2)}}</div>
                                                    <div class="person_name ellipsis-1">{{item.UserName}}</div>
                                                    <img v-on:click="guanbi_pic(item.UserID,0)" src="../image/cx.png">
                                                    <!-- <i class="icon iconfont icon-guanbi" v-on:click="guanbi_pic(index,0)"></i> -->
                                                </div>
                                            </div>
                                            <div v-if="select_id_list.length>3">
                                                <div class="shenpi">
                                                    <div class="shenpi_person">
                                                        <div class="person" v-bind:class="{'small_active':select_id_list.length>99}" v-on:click="open_more(0)">{{select_id_list.length}}人</div>
                                                        <!-- <div class="person"><i class="icon iconfont icon-sandian"
                                                                v-on:click="open_more()"></i></div> -->
                                                        <div class="person_name ellipsis-1">全部</div>
                                                        <!-- <img  v-on:click="guanbi_pic(index,0)" src="../image/cx.png"> -->
                                                    </div>
                                                </div>
                                                <div class="shenpi" v-for="(item,index) in select_id_list.slice(-2)">
                                                    <div class="shenpi_person">
                                                        <div class="person">{{item.UserName.slice(-2)}}</div>
                                                        <div class="person_name ellipsis-1">{{item.UserName}}</div>
                                                        <img v-on:click="guanbi_pic(item.UserID,0)"
                                                            src="../image/cx.png">
                                                        <!-- <i class="icon iconfont icon-guanbi" v-on:click="guanbi_pic(index,0)"></i> -->
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="cl"></div>
                                    </div>
                                </div>
                                <div class="hide_height"></div>
                            </div>
                        </li>
                    </ul>

                </div>


                <div class="aui_formitem no_line">
                </div>
            </div>
        </div>
        <!-- 审批申请说明 -->
        <div class=" boxarea edit">
            <div class="aui_formitem only_line no_line p0">
                <!-- ({{examine_writenum}}/500) -->
                <div class="work_title">审批申请说明</div>
                <div class="aui_formcontent" style="padding-left: 0px;">
                    <van-field v-model="form.Remark" class="moretext" rows="3" maxlength="500"  autosize type="textarea" placeholder="请填写审批说明（选填）" show-word-limit/>
                    <!-- <textarea placeholder="请填写审批说明（选填）" maxlength="500" v-model="form.Remark"
                        style="height: 4rem;" @input="examine_writeMsg"></textarea> -->
                </div>
            </div>
        </div>
         <!-- 审批附件 -->
         <div class=" boxarea edit aui-padded-b-10">
            <div class="aui_formitem only_line no_line p0">
                <div  v-on:click="do_openUp_ex()"  class="work_title" style="border-left: 0;padding-left: 0;">附件上传
                    <i class="icon iconfont icon-xinzeng"  style="font-size: 0.7rem;float: right;"></i>
                </div>
                <div v-if="exUploadList!=undefined&&exUploadList.length>0" class="aui_formitem block"
                    style="border-bottom: none;width: 100%;">
                    <div class="aui_formcontent" style="padding-left: 0px; text-align: left;">
                        <div class="wenjian_item" v-for="(item,index) in exUploadList">
                            <div class="wj_name ellipsis_one">{{item.FileName}}</div>
                            <div class="wj_delete">
                                <span v-on:click="open_flie_ex(item,index)">预览</span>
                                <i v-on:click="do_delete_ex(item.ID)" class="icon iconfont icon-guanbi"
                                    style="font-size: 0.75rem; margin-left: 15px;"></i>
                            </div>
                        </div>
                    </div>
                </div>
                <van-popup v-model="exshowup" round position="bottom" :style="{ height: '20%' }">
                    <div v-on:click="add_picture_ex()" class="up_item mt10" style="border-bottom: solid 0.5px #eee;">
                        上传图片
                    </div>
                    <!-- <div v-on:click="add_vedio_ex()" class="up_item" style="border-bottom: solid 0.5px #eee;">
                    上传视频
                </div> -->
                    <div v-on:click="add_wenjian_ex()" class="up_item">上传文件</div>
                </van-popup>
            </div>
        </div>

        <div class="form-height"></div>

        <!-- <div class="aui_bottom" style="display: flex;justify-content: space-between;">
            <div class="aui_bottombtn new_bottombtn" v-on:click="do_save(1)" style="background: #fff;color: #289FFF;">暂存</div>
            <div class="aui_bottombtn" v-on:click="do_save()" style="width: 70%;">提交</div>
        </div> -->
        <div class="aui_bottom" >
            <div class="aui_bottombtn" v-on:click="do_save()" >提交</div>
        </div>
    </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/aui-toast.js"></script>
<script type="text/javascript" src="../script/aui-actionsheet.js"></script>
<script type="text/javascript " src="../script/vant/vue.js"></script>
<script type="text/javascript " src="../script/vant/vant.js"></script>
<script type="text/javascript" src="../script/config.js"></script>
<script type="text/javascript" src="../script/mui/mui.min.js"></script>
<script type="text/javascript" src="../script/mui/mui.picker.min.js"></script>
<script type="text/javascript" src="../script/mui/mui.poppicker.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript " src="js/ckpurchaseapply_add.js"></script>

</html>
